Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Expose $el to v-scope #147

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Expose $el to v-scope #147

wants to merge 1 commit into from

Conversation

jhuddle
Copy link

@jhuddle jhuddle commented Mar 11, 2022

This small change allows one to use element properties as values for props defined in v-scope. For a toy example:

<textarea
  v-scope="{width: $el.offsetWidth, height: $el.offsetHeight}"
  @click="width = $el.offsetWidth; height = $el.offsetHeight;"
>{{ width }} &times; {{ height }}</textarea>

This small change allows one to use element properties as values for props defined in `v-scope`... I'm finding it makes for a nice shorthand when trying to define such props on mount. For a toy example:
```
<textarea
	v-scope="{width: $el.offsetWidth, height: $el.offsetHeight}"
	@click="width = $el.offsetWidth; height = $el.offsetHeight;"
>{{ width }} &times; {{ height }}</textarea>
```
vs. currently:
```
<textarea
	v-scope="{width: null, height: null}"
	@VUE:mounted="width = $el.offsetWidth; height = $el.offsetHeight;"
	@click="width = $el.offsetWidth; height = $el.offsetHeight;"
>{{ width }} &times; {{ height }}</textarea>
```
@pwFoo
Copy link

pwFoo commented Aug 5, 2022

Is that added? Tested $el in component or componente template and get no value.

@jikkuatwork
Copy link

Can't this be done in v-effect

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants